<template>
    <div class="goTop">
        <a class="gotopIcon" @click="goTop"></a>
    </div>
</template>

<script>
import $ from 'jquery'
export default {
    data() {
        return {
        }
    },
    methods: {
        goTop() {
            $('body,html').animate({ scrollTop: 0 }, 500);
        }
    },

}  
</script>

<style scoped>
/* 置顶 */

.goTop {
    position: fixed;
    right: 30px;
    bottom: 150px;
    z-index: 20000;
}

.goTop a {
    width: 50px;
    height: 50px;
    display: block;
    cursor: pointer;
    vertical-align: top;
    line-height: 46px;
    text-align: center;
    transition: all .2s;
    border: 1px solid #ededed;
    font-size: 22px;
    position: relative;
    background: #fff;
    box-shadow: 0px 0px 1px #a5a5a5;
}


.goTop a.gotopIcon {
    background: #fff url(../assets/images/icon/goTop.png) no-repeat center;
}
</style>
